layui.config({
    base: '../../static/layuiadmin/' //静态资源所在路径
}).extend({
    index: 'lib/index' //主入口模块
}).use(['form','layer','index', 'useradmin', 'table'], function(){
    var form=layui.form,layer=layui.layer;
    var map = new BMap.Map("container");
    var geoc = new BMap.Geocoder();  //地址解析对象
    var markersArray = [];
    var geolocation = new BMap.Geolocation();
    var point = new BMap.Point(116.331398, 39.897445);
    map.centerAndZoom(point, 12); // 中心点
    var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
        {"input" : "search"
            ,"location" : map
        });
    ac.addEventListener("onhighlight", function(e) {  //鼠标放在下拉列表上的事件
        var str = "";
        var _value = e.fromitem.value;
        var value = "";
        if (e.fromitem.index > -1) {
            value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
        }
        str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

        var value = "";
        if (e.toitem.index > -1) {
            _value = e.toitem.value;
            value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
        }
        str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
        $("searchResultPanel").val(str) ;
    });
    var myValue;
    ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件
        var _value = e.item.value;
        myValue = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
        $("searchResultPanel").val ("onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue);
        setPlace();
    });

    function setPlace(){
        map.clearOverlays();    //清除地图上所有覆盖物
        function myFun(){
            var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
            map.centerAndZoom(pp, 18);
            map.addOverlay(new BMap.Marker(pp));    //添加标注
        }
        var local = new BMap.LocalSearch(map, { //智能搜索
            onSearchComplete: myFun
        });
        local.search(myValue);
    }
    geolocation.getCurrentPosition(function (r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);
            map.panTo(r.point);
            map.enableScrollWheelZoom(true);
        }
        else {
            alert('failed' + this.getStatus());
        }
    }, {enableHighAccuracy: true})
    map.addEventListener("click", showInfo);
    //清除标识
    function clearOverlays() {
        if (markersArray) {
            for (i in markersArray) {
                map.removeOverlay(markersArray[i])
            }
        }
    }
    //地图上标注
    function addMarker(point) {
        var marker = new BMap.Marker(point);
        markersArray.push(marker);
        clearOverlays();
        map.addOverlay(marker);
    }
    //点击地图时间处理
    function showInfo(e) {
        var str = e.point.lng+','+e.point.lat
        var address='';
        geoc.getLocation(e.point, function (rs) {
            var addComp = rs.addressComponents;
            address = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
        });
        $.ajax({
            url:"https://devapi.qweather.com/v7/weather/now?key=a89c041c7ba442f281e0fa808641c22e&location="+str,
            type:"get",
            success:function (result) {
                if(result.code==200){
                    var now = result.now;
                    layer.open({
                        type: 1
                        ,title: false //不显示标题栏
                        ,area:['25%', '80%']
                        ,closeBtn:false
                        ,btn: ['关闭']
                        ,btnAlign: 'c'
                        ,content: `
                                <form class="layui-form" action="" style="padding: 10px">
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">地址</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${address}" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">观测时间</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.obsTime}" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">温度</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.temp}℃" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">体感温度</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.feelsLike}℃" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">天气</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.text}" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">风向</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.windDir}" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">风力等级</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.windScale}" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">风速</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.windSpeed}km/h" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">相对湿度</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.humidity}%" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">降水量</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.precip}mm" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">大气压强</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.pressure}百帕" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">能见度</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.vis}km" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">露点温度</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.dew}℃" disabled class="layui-input ">
                                        </div>
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">云量</label>
                                        <div class="layui-input-inline">
                                            <input type="text" value="${now.cloud}%" disabled class="layui-input ">
                                        </div>
                                    </div>
                                </form>
                        `
                    });
                }
                return false;
            }
        });

        addMarker(e.point);
    }

});